<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>中国移动网上营业厅首页</title>
    <link rel="stylesheet" href="../css/flex.css"/>
    <link rel="stylesheet" href="//at.alicdn.com/t/font_1501678_rdu9qhu7yzb.css"/>
    <link rel="stylesheet" href="../css/yidong.css"/>
</head>
<body>
                     <!--头部-->
<header flex="main:center">

    <div class="safe" flex="main:justify">

       <div flex>

           <div class="hr-k" flex="main:center cross:center">ENGLISH</div>
           <div class="hr-k" flex="main:center cross:center">政企客户</div>

       </div>

        <div flex="main:center cross:center">

            <div flex="cross:center">
                <i class="iconfont iconrentou"></i>
                <span class="hr-sn">登陆</span>
                <div class="hr-h"></div>

            </div>

            <div flex="cross:center">
                <i class="iconfont iconshouji"></i>
                <span class="hr-sn1">手机营业厅</span>
                <div class="hr-h"></div>
            </div>

            <div flex="cross:center">
                <span class="hr-sn1">积分商城</span>
                <div class="hr-h"></div>
            </div>

            <div flex="cross:center">
                <span class="hr-sn1">关于中国移动</span>
            </div>

        </div>

    </div>



</header>

                     <!--楼层1-->

<section flex="main:center">

    <div class="safe" flex="main:justify">

            <div class="f1-k" flex="main:center cross:center">

                <img src="../img/1.png"/>
                <select>

                    <option>福州</option>
                    <option>厦门</option>
                    <option>泉州</option>
                    <option>漳州</option>
                    <option>莆田</option>
                    <option>宁德</option>
                    <option>龙岩</option>

                </select>
                
            </div>


                <div class="f1-k1">
                  <div flex>
                    <input type="text">

                        <button flex="main:center cross:center">
                            <i class="iconfont iconsousuo"></i>
                            <span>搜索</span>
                        </button>
                  </div>

                    <div class="f1-k2" flex="main:justify">
                        <span class="f1-sn1">买1G赠1G</span>
                        <span class="f1-sn">宽带</span>
                        <span class="f1-sn">通话记录查询</span>
                        <span class="f1-sn">家庭网</span>
                        <span class="f1-sn">神州行</span>
                        <span class="f1-sn">选号入网</span>
                    </div>

                </div>

    </div>

</section>

                    <!--导航栏-->

<nav class="safe n1">

     <div class="nav-k" flex="main:justify">

        <button class="nav-bn" flex="main:center cross:center">首页</button>
        <button class="nav-bn" flex="main:center cross:center">移动商城</button>
        <button class="nav-bn" flex="main:center cross:center">我的移动</button>
        <button class="nav-bn1" flex="main:center cross:center">网上营业厅</button>
        <button class="nav-bn" flex="main:center cross:center">服务与支持</button>

     </div>

</nav>

                    <!--楼层2-->

<section class="safe n2">

    <div class="f2-k" flex="main:justify">

        <div class="f2-k1" flex="main:justify cross:center">
            <i class="iconfont icondizhi"></i>
            <span>营业厅导航</span>
        </div>

        <div class="f2-k2" flex="main:justify cross:center">
            <i class="iconfont iconindex"></i>
            <span>您现在所在的位置:首页>网上营业厅>宽带专区</span>
        </div>
    </div>

    <div flex="main:justify">

        <img src="../img/gongluo.jpg"/>

        <div class="f2-k3">

            <div flex="main:center cross:center">

                <img src="../img/touxiang.png"/>
                <span>亲爱的用户，您好~<br>
欢迎登录宽带/互联网电视专区</span>

            </div>

                <div flex>

                    <button class="f2-bn">我的宽带信息</button>
                    <button class="f2-bn1">我的互联网电视信息</button>

                </div>

            <ul>

                <li class="f2-li">
                    <span class="f2-sn">◆ 宽带账号：</span>
                    <select class="f2-st">
                        <option>13615040856</option>
                        <option>18296587956</option>
                        <option>13615040856</option>
                        <option>13615040856</option>
                    </select>
                </li>

                <li class="f2-li">
                    <span class="f2-sn">◆ 当前宽带：  20M</span>
                </li>

                <li class="f2-li">
                    <span class="f2-sn">◆ 宽带状态：  正常</span>
                </li>

                <li class="f2-li">
                    <span class="f2-sn">◆ 到期时间：  2016年10月01日 </span>
                </li>

                <li class="f2-li">
                    <span class="f2-sn">◆ 宽带续费：</span>
                    <button class="f2-bn2">续费此宽带</button>

                </li>

                <li class="f2-li">
                    <span class="f2-sn">◆ 新装进度：</span>
                    <button class="f2-bn3" >查询新装进度</button>

                </li>

            </ul>

        </div>

    </div>

</section>

                    <!--楼层3-->

<section class="safe n3">

    <div class="f3-k" flex="main:justify">

        <div>
            <h6 class="f3-h">12580约你中瑞看电影</h6>
            <p class="f3-p">10积分购券马上抢</p>
            <img src="../img/xiazai.jpg" class="f3-img"/>
        </div>

        <div>
            <h6 class="f3-h">福建手机营业厅</h6>
            <p class="f3-p">首登立送100M免费流量，靠谱！</p>
            <img src="../img/qian.jpg" class="f3-img1"/>
        </div>

        <div>
            <h6 class="f3-h">缤纷超乎想象</h6>
            <p class="f3-p">办理送两个月话费</p>
            <img src="../img/sheng.jpg" class="f3-img2"/>
        </div>

        <div>
            <h6 class="f3-h">4G流量卡50套餐</h6>
            <p class="f3-p">2G流量+接听免费+免费来电显示</p>
            <img src="../img/50yuan.jpg" class="f3-img3"/>
        </div>
    </div>

</section>

                <!--楼层4-->

<section class="safe n3">

    <div class="f4-k" flex="main:justify">

        <button class="f4-bn">
            
            <span>宽带新装</span>
            <img src="../img/jinri.png"/>
        
        </button>

        <button class="f4-bn1">

            <span>宽带续费</span>

        </button>

        <button class="f4-bn">

            <span>宽带提速</span>
            <img src="../img/new.png"/>

        </button>

        <button class="f4-bn">

            <span>互联网电视</span>

        </button>

    </div>

                <!--第二部分-->

    <div class="f4-k1" flex>

        <div class="f4-k2" flex="main:center cross:center">
            <img src="../img/dian.png"/>
        </div>

        <div class="f4-k3">

            <div>

                <span class="f4-sn">手机号码：  </span><span class="f4-sn1">150123456789</span><span class="f4-sn2">宽带账号：</span><button class="f4-k4">13615040856</button><span class="f4-sn3">装机地址：</span><span class="f4-sn1">福州市鼓楼区铜盘路五凤小区3#304</span>

            </div>

            <div class="f4" flex>

                <span class="f4-sn">套餐信息：  </span>
                <div>

                    <div class="f4-k5" flex="dir:top cross:center">

                        <div class="f4-k51" flex="main:center cross:center">
                            类型
                        </div>
                        <div class="f4-k52" flex="main:center cross:center">
                            包年型套餐
                        </div>
                    </div>

                </div>

                <div>

                    <div class="f4-k6" flex="dir:top cross:center">

                        <div class="f4-k61" flex="main:center cross:center">
                            套餐名称
                        </div>
                        <div class="f4-k62" flex="main:center cross:center">
                            20M宽带包年600元
                        </div>
                    </div>

                </div>

                <div>

                    <div class="f4-k7" flex="dir:top cross:center">

                        <div class="f4-k71" flex="main:center cross:center">
                            速率
                        </div>
                        <div class="f4-k72" flex="main:center cross:center">
                            20M
                        </div>
                    </div>

                </div>

                <div>

                    <div class="f4-k8" flex="dir:top cross:center">

                        <div class="f4-k81" flex="main:center cross:center">
                            时限
                        </div>
                        <div class="f4-k82" flex="main:center cross:center">
                            12个月
                        </div>
                    </div>

                </div>

                <div>

                    <div class="f4-k9" flex="dir:top cross:center">

                        <div class="f4-k91" flex="main:center cross:center">
                            资费
                        </div>
                        <div class="f4-k92" flex="main:center cross:center">
                            600元
                        </div>
                    </div>

                </div>

                <div>

                    <div class="f4-k10" flex="dir:top cross:center">

                        <div class="f4-k101" flex="main:center cross:center">
                            到期时间
                        </div>
                        <div class="f4-k102" flex="main:center cross:center">
                            2016年09月30日
                        </div>
                    </div>

                </div>

            </div>

        </div>

    </div>

    <!--第三部分-->

    <div class="f4-pl">

        <ul>

            <li class="f4-li" flex="cross:center">
                <span class="f4-sn4">城市：</span>
                <button class="f4-3-bn">不限</button>
                <button class="f4-3-bn1">福州</button>
                <button class="f4-3-bn1">厦门</button>
                <button class="f4-3-bn1">宁德</button>
                <button class="f4-3-bn1">莆田</button>
                <button class="f4-3-bn1">泉州</button>
                <button class="f4-3-bn1">漳州</button>
                <button class="f4-3-bn1">龙岩</button>
                <button class="f4-3-bn1">三明</button>
                <button class="f4-3-bn1">南平</button>
            </li>

            <li class="f4-li" flex="cross:center">
                <span class="f4-sn4">带宽：</span>
                <button class="f4-3-bn">不限</button>
                <button class="f4-3-bn1">20M</button>
                <button class="f4-3-bn1">50M</button>
                <button class="f4-3-bn1">100M</button>
            </li>

            <li class="f4-li" flex="cross:center">
                <span class="f4-sn4">时限：</span>
                <button class="f4-3-bn">不限</button>
                <button class="f4-3-bn1">保底</button>
                <button class="f4-3-bn1">包月</button>
                <button class="f4-3-bn1">包年</button>
                <button class="f4-3-bn1">包两年</button>
            </li>

            <li class="f4-li" flex="cross:center">
                <span class="f4-sn4">产品类型：</span>
                <button class="f4-3-bn6">不限</button>
                <button class="f4-3-bn2">限时特惠</button>
                <button class="f4-3-bn3">4G融合套餐</button>
                <button class="f4-3-bn4">纯宽带</button>
                <button class="f4-3-bn5">只显示 限时特惠</button>
            </li>

        </ul>

    </div>

</section>

                     <!--楼层5-->

<section class="safe n5">

    <div class="f5-1" flex>

        <div class="f5-k">

            <div class="f5-k1" flex="main:center cross:center">

                <img src="../img/tehui.png">
                <i class="iconfont iconjiating"></i>
                <span>和家庭</span>

            </div>

            <div class="f5-k2" flex="main:center cross:center">

                <img src="../img/xianshi.png"/>
                <div class="f5-k3">

                    <h5>399元享1年20M宽带送话费</h5>
                    <p>1、套餐费50元/月，按日摊分月末补足<br>
                        （生效当月不补足）。<br>
                        2、带宽50Mbps，不限时长。<br>
                        3、对应的手机保底消费38元/月（不含宽<br>
                        带费和代收费）。</p>

                </div>

            </div>

            <div class="f5-x" flex="cross:center">
                <h5>40<span>元/月</span></h5>
                <button>立即抢购</button>
            </div>

        </div>

        <div class="f5-k">

            <div class="f5-k1" flex="main:center cross:center">

                <img src="../img/tehui.png">
                <i class="iconfont iconjiating"></i>
                <span>和家庭</span>

            </div>

            <div class="f5-k2" flex="main:center cross:center">

                <img src="../img/xianshi.png"/>
                <div class="f5-k3">

                    <h5>和家庭139套餐</h5>
                    <p>1、套餐费50元/月，按日摊分月末补足<br>
                        （生效当月不补足）。<br>
                        2、带宽50Mbps，不限时长。<br>
                        3、对应的手机保底消费38元/月（不含宽<br>
                        带费和代收费）。</p>

                </div>

            </div>

            <div class="f5-x1" flex="cross:center">
                <h5>139<span>元/月</span></h5>
                <button>立即抢购</button>
            </div>

        </div>

        <div class="f5-k">

            <div class="f5-k1" flex="main:center cross:center">

                <img src="../img/tehui.png">
                <i class="iconfont iconjiating"></i>
                <span>和家庭</span>

            </div>

            <div class="f5-k2" flex="main:center cross:center">

                <img src="../img/xianshi.png"/>
                <div class="f5-k3">

                    <h5>和家庭169套餐</h5>
                    <p>1、套餐费50元/月，按日摊分月末补足<br>
                        （生效当月不补足）。<br>
                        2、带宽50Mbps，不限时长。<br>
                        3、对应的手机保底消费38元/月（不含宽<br>
                        带费和代收费）。</p>

                </div>

            </div>

            <div class="f5-x1" flex="cross:center">
                <h5>169<span>元/月</span></h5>
                <button>立即抢购</button>
            </div>

        </div>

        <div class="f5-k-1">

            <div class="f5-k4" flex="main:center cross:center">

                <img src="../img/tehui.png">
                <i class="iconfont iconkuandai"></i>
                <span>纯宽带</span>

            </div>

            <div class="f5-k2" flex="main:center cross:center">

                <img src="../img/xianshi.png"/>
                <div class="f5-k3">

                    <h5>宽带40元包月套餐（保底型）</h5>
                    <p>1、套餐费50元/月，按日摊分月末补足<br>
                        （生效当月不补足）。<br>
                        2、带宽50Mbps，不限时长。<br>
                        3、对应的手机保底消费38元/月（不含宽<br>
                        带费和代收费）。</p>

                </div>

            </div>

            <div class="f5-x" flex="cross:center">
                <h5>40<span>元/月</span></h5>
                <button>立即抢购</button>
            </div>

        </div>

    </div>

    <div class="f5-1" flex>

        <div class="f5-k-2">

            <div class="f5-k4" flex="main:center cross:center">

                <img src="../img/tehui.png">
                <i class="iconfont iconkuandai"></i>
                <span>纯宽带</span>

            </div>

            <div class="f5-k2" flex="main:center cross:center">

                <img src="../img/xianshi.png"/>
                <div class="f5-k5">

                    <h5>宽带50元包月套餐（保底型）</h5>
                    <p>1、套餐费50元/月，按日摊分月末补足<br>
                        （生效当月不补足）。<br>
                        2、带宽50Mbps，不限时长。<br>
                        3、对应的手机保底消费38元/月（不含宽<br>
                        带费和代收费）。</p>

                </div>

            </div>

            <div class="f5-x" flex="cross:center">
                <h5>50<span>元/月</span></h5>
                <button>立即抢购</button>
            </div>

        </div>

        <div class="f5-k-2">

            <div class="f5-k4" flex="main:center cross:center">

                <img src="../img/tehui.png">
                <i class="iconfont iconkuandai"></i>
                <span>纯宽带</span>

            </div>

            <div class="f5-k2" flex="main:center cross:center">

                <img src="../img/xianshi.png"/>
                <div class="f5-k3">

                    <h5>宽带60元包月套餐（保底型）</h5>
                    <p>1、套餐费50元/月，按日摊分月末补足<br>
                        （生效当月不补足）。<br>
                        2、带宽50Mbps，不限时长。<br>
                        3、对应的手机保底消费38元/月（不含宽<br>
                        带费和代收费）。</p>

                </div>

            </div>

            <div class="f5-x" flex="cross:center">
                <h5>60<span>元/月</span></h5>
                <button>立即抢购</button>
            </div>

        </div>

        <div class="f5-k-2">

            <div class="f5-k4" flex="main:center cross:center">

                <img src="../img/tehui.png">
                <i class="iconfont iconkuandai"></i>
                <span>纯宽带</span>

            </div>

            <div class="f5-k2" flex="main:center cross:center">

                <img src="../img/xianshi.png"/>
                <div class="f5-k3">

                    <h5>宽带60元包月套餐（保底型）</h5>
                    <p>1、套餐费50元/月，按日摊分月末补足<br>
                        （生效当月不补足）。<br>
                        2、带宽50Mbps，不限时长。<br>
                        3、对应的手机保底消费38元/月（不含宽<br>
                        带费和代收费）。</p>

                </div>

            </div>

            <div class="f5-x" flex="cross:center">
                <h5>60<span>元/月</span></h5>
                <button>立即抢购</button>
            </div>

        </div>

    </div>

</section>

                            <!--楼层6-->

<section class="safe n6">

    <button>自助服务</button>

    <div flex="main:justify">

        <div class="f6-k" flex="dir:top cross:center">

            <img src="../img/xiu.png"/>
            <span>宽带密码修改</span>

        </div>

        <div class="f6-k" flex="dir:top cross:center">

            <img src="../img/chong.png"/>
            <span>宽带密码重置</span>

        </div>

        <div class="f6-k" flex="dir:top cross:center">

            <img src="../img/xiu.png"/>
            <span>互联网电视密码修改</span>

        </div>

        <div class="f6-k1" flex="dir:top cross:center">

            <img src="../img/huojian.png"/>
            <span>宽带下载测试</span>

        </div>

        <div class="f6-k2" flex="dir:top cross:center">

            <img src="../img/ditu.png"/>
            <span>宽带下载测试</span>

        </div>

        <div class="f6-k" flex="dir:top cross:center">

            <img src="../img/shu.png"/>
            <span>排障手册</span>

        </div>

    </div>

    <div flex>

        <div class="f6-m">

            <div class="f6-w" flex="cross:center">
                <i class="iconfont icontuoyuankaobei"></i>
                <h6>新手指南</h6>
            </div>

            <p>购机常见问题  购机常见问题</p>
            <p>购买手机流程  购买号码流程</p>

        </div>

        <div class="f6-m2">

            <div class="f6-w2" flex="cross:center">
                <i class="iconfont iconjinqian"></i>
                <h6>付款方式</h6>
            </div>

            <p>网银支付</p>

        </div>

        <div class="f6-m3">

            <div class="f6-w3" flex="cross:center">
                <i class="iconfont iconwuliu1"></i>
                <h6>物流和售后</h6>
            </div>

            <p>配送说明 退换货流程</p>

        </div>

        <div class="f6-m4">

            <div class="f6-w4" flex="cross:center">
                <i class="iconfont iconshoujiyingyeting"></i>
                <h6>手机营业厅</h6>
            </div>

            <img src="../img/erweima.jpg"/>

        </div>

    </div>

</section>

                    <!--尾巴-->

<footer class="safe n7">

    <div flex="cross:center dir:top">

        <div flex>

            <a href="#" class="fr-a" flex="main:center cross:center">新闻中心</a>
            <a href="#" class="fr-a" flex="main:center cross:center">诚聘英才</a>
            <a href="#" class="fr-a" flex="main:center cross:center">采购信息</a>
            <a href="#" class="fr-a" flex="main:center cross:center">企业合作</a>
            <a href="#" class="fr-a" flex="main:center cross:center">联系我们</a>
            <a href="#" class="fr-a" flex="main:center cross:center">站点导航</a>
            <a href="#" class="fr-a2" flex="main:center cross:center">中国移动研究院</a>
            <a href="#" class="fr-a2" flex="main:center cross:center">中国移动设计院</a>
            <a href="#" class="fr-a" flex="main:center cross:center">网站地图</a>
            <a href="#" class="fr-a3" flex="main:center cross:center">友情链接</a>

        </div>

        <p class="fr-1">掌上营业厅：wap.10086.cn 语音自助服务：10086 短信营业厅：10086 自助终端 营业厅 手机营业厅下载</p>
        <p class="fr-1">Copyright@1999-2006 中国移动 版权所有</p>
        <p class="fr-2">中华人民共和国增值电信业务经营许可证 经营许可证编号：A2.B1.B2-200100001</p>

        <div flex="cross:center">

            <img src="../img/kexin.jpg"/>
            <img src="../img/biao.jpg" class="fr-tu"/>
            <p>京ICP备05002571号</p>

        </div>

    </div>






</footer>


</body>
</html>